import "./style.scss";
import { Card, Col, Divider, Row } from "antd";
import { useTranslation } from "react-i18next";
import sjx from '@/assets/new/sjx.png'
const ThirdHomePage = () => {
  const { t } = useTranslation();

  return (
    <div className="third-home-page-pc">
      <Row className="row-one">
        <Col span={24}>
          <div className="title">
            <span>TURINGBOT—</span>
            <span>{t("IntelligentTradingBusiness")}</span>
          </div>
          <div className="description">
            <span>{t("TradingRobot")}</span>，
            <span>{t("DontMissOpportunities")}</span>
          </div>
        </Col>

      </Row>
      <Row className="row-two pc" justify="center" align="center">
        <Col xs={24} sm={11} md={11} lg={6} xl={6} xxl={{ span: 6 }}>
          <div className="card-container">
            <Card>
              <div className="card-main-title">
                {t("OneKeyBuySell")}
              </div>
              <div className="subtitle">
                {t("RapidProfitability")}
              </div>
              <Divider />
              <div className="detail">
                <span>{t("HeatAnalysis")}</span>
                <span>{t("RPCNode")}</span>
                <span>{t("ContractSecurity")}</span>
                <span>{t("AntiRobotRecognition")}</span>
                <span>{t("MultiPlatform")}</span>
                <span>{t("SupportsOneClickBuying")}</span>
                <span>{t("WatchRobot")}</span>
                <span>{t("GasSetting")}</span>
                <span>{t("MultiNetwork")}</span>
              </div>
            </Card>
          </div>
        </Col>
        <Col xs={24} sm={11} md={11} lg={6} xl={6} xxl={6}>
          <div className="card-container">
          <img src={sjx} /> 
            <Card>
              <div className="card-main-title">{t("OneKeyTracking")}</div>
              <div className="subtitle">
                {t("SmartMoneyReturns")}
              </div>
              <Divider />
              <div className="detail">
                <span>{t("ManySmartWallet")}</span>
                <span>{t("MultiNetwork")}</span>
                <span>{t("AutomaticFilteringPixiu")}</span>
                <span>{t("PurchaseProportionally")}</span>
                <span>{t("SupportStopProfitAndStopLoss")}</span>
                <span>{t("WatchRobot")}</span>
                <span>{t("TelegramMessage")}</span>
                <span>{t("MainDex")}</span>
                <span>7*{t("724FollowCase")}</span>
                <span>{t("AntiRobotClampingOrders")}</span>
              </div>
            </Card>
          </div>
        </Col>
        <Col xs={24} sm={11} md={11} lg={6} xl={6} xxl={6}>
          <div className="card-container">
          <img src={sjx} /> 
            <Card>
              <div className="card-main-title">{t("OneKeyRace")}</div>
              <div className="subtitle">
                {t("CatchIPO")}
              </div>
              <Divider />
              <div className="detail">
                <span>{t("RPCNode")}</span>
                <span>{t("ContractSecurity")}</span>
                <span>{t("AntiRobotRecognition")}</span>
                <span>{t("MainDex")}</span>
                <span>{t("SupportsPriceLimitOrders")}</span>
                <span>{t("SupportStopProfitAndStopLoss")}</span>
                <span>{t("SupportSettingLiquidityConditions")}</span>
                <span>{t("WatchRobot")}</span>
                <span>{t("GasSetting")}</span>
                <span>{t("MultiNetwork")}</span>
              </div>
            </Card>
          </div>
        </Col>
        <Col xs={24} sm={11} md={11} lg={6} xl={6} xxl={6}>
          <div className="card-container">
          <img src={sjx} /> 
            <Card>
              <div className="card-main-title">{t("OneKeyDelegation")}</div>
              <div className="subtitle">
                {t("PersonalizedTradingStrategy")}
              </div>
              <Divider />
              <div className="detail">
                <span>{t("BulkLimitedPriceBuying")}</span>
                <span>{t("BulkLimitedPriceSell")}</span>
                <span>{t("IntelligentLimitCommission")}</span>
                <span>{t("ContractSecurity")}</span>
                <span>{t("AntiRobotRecognition")}</span>
                <span>{t("WatchRobot")}</span>
                <span>{t("GasSetting")}</span>
                <span>{t("MultiNetwork")}</span>
              </div>
            </Card>
          </div>
        </Col>
      </Row>


    </div>
  );
};

export default ThirdHomePage;
